<template>
  <div>
    <div style="width:10%">
      <h3>考次</h3>
      <Divider style="height: 2px;margin:15px 0;display: inline-block;" />
    </div>
    <div style="width:80%">
      <h4 style="float: left">考次信息填写</h4>
      <Button id="b1" @click="exit()">退出</Button>
      <Divider style="height: 2px;margin:15px 0;display: inline-block;" />
    </div>
    <Form style="width: 60%;" ref="formExamination" :model="formExamination" :rules="ruleExamination" :label-width="120">
      <FormItem label="考次编码" prop="esId">
        <Input v-model="formExamination.esId"></Input>
      </FormItem>
      <!-- <FormItem label="版本编码" prop="mvId">
        <Select v-model="formExamination.mvId" clearable style="width:200px">
          <Option v-for="item in MvIdList" :value="item.mvId" :key="item.mvid  ">{{ item.mvName }}</Option>
        </Select>
      </FormItem> -->
      <FormItem label="考次类型" prop="esXamtype">
        <Select v-model="formExamination.esXamtype" clearable style="width:200px">
          <Option v-for="item in ExamTypeList" :value="item.value" :key="item.value">{{ item.label }}</Option>
        </Select>
      </FormItem>
      <!-- <FormItem label="计划考次状态" prop="esPlanstate">
        <Select v-model="formExamination.esPlanstate" clearable style="width:200px">
          <Option v-for="item in PlanStateList" :value="item.value" :key="item.value">{{ item.label }}</Option>
        </Select>
      </FormItem>
      <FormItem label="考务考次状态" prop="esExamstate">
        <Select v-model="formExamination.esExamstate" clearable style="width:200px">
          <Option v-for="item in ExamStateList" :value="item.value" :key="item.value">{{ item.label }}</Option>
        </Select>
      </FormItem>
      <FormItem label="考籍考次状态" prop="esTestistate">
        <Select v-model="formExamination.esTestistate" clearable style="width:200px">
          <Option v-for="item in ExamStateList" :value="item.value" :key="item.value">{{ item.label }}</Option>
        </Select>
      </FormItem> -->
      <FormItem label="开始时间和结束时间">
        <Row>
          <Col span="11">
          <FormItem prop="esStarttime">
            <DatePicker type="date" placeholder="开始时间" v-model="formExamination.esStarttime"></DatePicker>
          </FormItem>
          </Col>
          <Col span="2" style="text-align: center">-----</Col>
          <Col span="11">
          <FormItem prop="esEndtime">
            <DatePicker type="date" placeholder="结束时间" v-model="formExamination.esEndtime"></DatePicker>
          </FormItem>
          </Col>
        </Row>
      </FormItem>
      <label style="font-size: 1rem;">统考课程默认收费值26元 照相费用10元</label><br></br>
      <FormItem label="备注" prop="esRemark">
        <Input v-model="formExamination.esRemark"></Input>
      </FormItem>
      <FormItem>
        <Button type="primary" @click="handleSubmit('formExamination')">新增</Button>
      </FormItem>
    </Form>
  </div>
</template>

<script>
  export default {
    data() {
      return {
        formExamination: {
          esId: '',
          mvId: '1',
          esXamtype: '',
          esPlanstate: 1,
          esExamstate: 2,
          esTestistate: 2,
          esStarttime: '',
          esEndtime: '',
          esUecc: 26,
          esPhotofee: 10,
          esRemark: ''
        },
        ruleExamination: {
          esId: [{
            required: true,
            message: '考次编码不能为空',
            trigger: 'blur',
          }]
        },
        // MvIdList: [],
        ExamTypeList: [{
            value: 0,
            label: '省考'
          },
          {
            value: 1,
            label: '统考'
          }
        ],
        PlanStateList: [{
            value: 0,
            label: '已用'
          },
          {
            value: 1,
            label: '未用'
          }
        ],
        ExamStateList: [{
            value: 0,
            label: '冻结'
          },
          {
            value: 1,
            label: '当前'
          },
          {
            value: 2,
            label: '未用'
          }
        ]
      }
    },
    created() {
      // this.$axios.get(this.$host + '/examination/management/allMV_ID?pageNum=1&&pageSize=1000').then(res => {
      //   this.MvIdList = res.data.data.list
      // })
    },
    methods: {
      handleSubmit(name) {
        this.$refs[name].validate((valid) => {
          if (valid) {
            this.$axios.post(this.$host + '/examination/management/NewExamsession', {
              esId: this.formExamination.esId,
              mvId: this.formExamination.mvId,
              esXamtype: this.formExamination.esXamtype,
              esPlanstate: this.formExamination.esPlanstate,
              esExamstate: this.formExamination.esExamstate,
              esTestistate: this.formExamination.esTestistate,
              esUecc: 26.00,
              esPhotofee: 10.00,
              esRemark: this.formExamination.esRemark,
              esStarttime: this.formExamination.esStarttime,
              esEndtime: this.formExamination.esEndtime,
              esIsHasCourse: '否'
            }).then(res => {
              console.log(res)
              if(res.data.message == '增加考次成功') {
                this.$Message.success('新增考次成功!');
                this.$router.push({
                  name: 'ExaminationList'
                })
              }
            })
          } else {
            this.$Message.error('新增失败!');
          }
        })
      },
      exit () {
        this.$router.push({
          name: 'ExaminationList'
        })
      }
    }
  }
</script>

<style scoped>
  h3 {
    font-size: 1.75rem;
    float: left;
  }

  #b1 {
    float: right;
    background-color: burlywood;
  }

  #b2 {
    background-color: cadetblue;
  }
</style>
